<template>
    <div class="todoheader">
        <h1>TODOLIST</h1>
        <router-link to="/todo"> TO todo</router-link>
        <router-link to="/login"> TO login</router-link>
        <router-link :to="{name:'test'}"> TO test</router-link>
        <!-- <router-link :to ="{name: 'test1/:id'}">To test1</router-link> -->
        <router-link to="/test/test1/123">To test1</router-link>
    </div>
</template>

<script>
export default {};
</script>

<style lang="scss" scoped>
@import "@/assets/styles/normal.scss";
$todoheaderBg: #09a5eb;
.todoheader {
  // height: 200px;
  background-color: $todoheaderBg;
  @include flexRow;
  flex-grow: 0;
}
.todoheader h1 {
  color: #fff;
  font-size: 65px;
  width: 100%;
  text-align: center;
}
.link-exact-active {
  color: red;
}
a {
  text-decoration: none;
}
</style>


